<template>
	<view v-if="pageShow">
		<!-- <u-swiper :list="list1" height="300" round="0"></u-swiper> -->
		<view class="" style="padding-bottom: 100rpx;">
			<view class="content mainpadding ffffff">
				<view class="titletext bold hei_text pdl">{{dataAll.name}}</view>
				<view class="flexbetween margin_top">
					<view class="flexleft">
						<view class="xiaoyuan"></view>
						<view class="titletext bold hei_text">活动时间</view>
					</view>
					<view class="huang_text bold flexleft">
						<view class="">距离结束还剩：</view>
						<u-count-down :time="dataAll.end_time" format="HH:mm:ss"></u-count-down>
					</view>
				</view>
				<view class="mainpadding">
					<view class="flexleft">
						<u-icon name="clock" color="#999" size="20"></u-icon>
						<view class="hei_text main_size bold mgrgin_left1">开始：{{dataAll.start_time_text}}</view>
					</view>
					<view class="flexleft margin_top">
						<u-icon name="clock" color="#999" size="20"></u-icon>
						<view class="hei_text main_size bold mgrgin_left1">结束：{{dataAll.end_time_text}}</view>
					</view>
					<view class="flexleft margin_top">
						<u-icon name="account" color="#999" size="20"></u-icon>
						<view class="hei_text main_size bold mgrgin_left1">限购：{{dataAll.xg_num}}件</view>
					</view>
				</view>
				<view class="margin_top">
					<view class="flexleft">
						<view class="xiaoyuan"></view>
						<view class="titletext bold hei_text">主商品</view>
					</view>
					<view class="flexleft mainpadding" v-for="item in dataAll.activitygoods" :key="item.id"
						v-show="item.goods_type==1">
						<image :src="item.goods.image_text" mode="" class="leftimage margin_right"></image>
						<view class="flexcolumn">
							<view class="hei_text titletext bold xiankuan">{{item.goods.name}}</view>
							<view class="xiaohui" v-show="item.join_goods_unit==1">{item.goods.biggoodsunit.name}
								<text
									v-show="item.goods.biggoodsunit.priceinfo.buy_send_score">(送{{item.goods.biggoodsunit.priceinfo.buy_send_score}}积分)</text>
							</view>
							<view class="xiaohui" v-show="item.join_goods_unit==2">{{item.goods.middlegoodsunit.name}}
								<text
									v-show="item.goods.middlegoodsunit.priceinfo.buy_send_score">(送{{item.goods.middlegoodsunit.priceinfo.buy_send_score}}积分)</text>
							</view>
							<view class="xiaohui" v-show="item.join_goods_unit==3">{{item.goods.smallgoodsunit.name}}
								<text
									v-show="item.goods.smallgoodsunit.priceinfo.buy_send_score">(送{{item.goods.smallgoodsunit.priceinfo.buy_send_score}}积分)</text>
							</view>
							<view class="flexbetween" style="width: 100%;">
								<view class="hong_text bold main_size">￥{{item.price}}</view>
								<view class="hong_text bold main_size">*{{item.num}}</view>
							</view>
						</view>
					</view>
				</view>
				<view class="margin_top">
					<view class="flexleft">
						<view class="xiaoyuan"></view>
						<view class="titletext bold hei_text">赠品</view>
					</view>
					<view class="flexleft mainpadding" v-for="item in dataAll.activitygoods" :key="item.id"
						v-show="item.goods_type==2">
						<image :src="item.goods.image_text" mode="" class="leftimage margin_right"></image>
						<view class="flexcolumn">
							<view class="hei_text titletext bold xiankuan">{{item.goods.name}}</view>
							<view class="xiaohui" v-show="item.join_goods_unit==1">{{item.goods.biggoodsunit.name}}
							</view>
							<view class="xiaohui" v-show="item.join_goods_unit==2">{{item.goods.middlegoodsunit.name}}
							</view>
							<view class="xiaohui" v-show="item.join_goods_unit==3">{{item.goods.smallgoodsunit.name}}
							</view>
							<view class="flexbetween" style="width: 100%;">
								<view class="hong_text bold main_size">￥{{item.price}}</view>
								<view class="hong_text bold main_size">*{{item.num}}</view>
							</view>
						</view>
					</view>
				</view>
				<view class="flexbetween mainpadding">
					<view class="hei_text titletext bold">份数</view>
					<!-- <view class="jiajian">
						<view class="jianhao" @click="minus()">
							<view class="line"></view>
						</view>
						<input type="number" min="1" v-model="buynum" class="xhtext" @blur="plus(2)">
						<view class="jiahao" @click="plus()"></view>
					</view> -->
					<view class="flexbetween bghui radius" style="padding: 10rpx;">
						<view class="reduceimg" @click="minus()"></view>
						<input type="number" min="1" style="width: 150rpx; text-align: center;" v-model="buynum"  @blur="plus(2)">
						<view class="addimg" @click="plus()"></view>
					</view>
				</view>
			</view>
		</view>

		<view class="posibottom flexbetween mainpadding ffffff" style="bottom: 0;">
			<view class="flexleft">
				<view class="hei_text bold titletext">合计：</view>
				<view class="hong_text bold titletext">￥{{price_zj}}</view>
			</view>
			<view class="btn" @click="xiadan">立即下单</view>
		</view>
	</view>
</template>

<script>
	import httpRequest from '@/commonFun/httpRequest.js'
	export default {
		data() {
			return {
				list1: [
					'https://cdn.uviewui.com/uview/swiper/swiper1.png',
					'https://cdn.uviewui.com/uview/swiper/swiper2.png',
					'https://cdn.uviewui.com/uview/swiper/swiper3.png',
				],
				listid: "",
				dataAll: {},
				buynum: 1,
				price_dj: 0, //活动商品单价
				price_zj: "",
				pageShow: false
			}
		},
		onLoad(options) {
			this.listid = options.id
			this.getdetail()
		},
		watch: {
			buynum(newval) {
				this.price_zj = (this.buynum * this.price_dj).toFixed(2)
			}
		},
		methods: {
			xiadan() {
				if (Number(this.buynum) > Number(this.dataAll.xg_num)) {
					httpRequest.toast("购买数量不可大于限购数量，限购" + this.dataAll.xg_num + "件")
					return false
				}
				let data = {
					ly_type: "1", //来源，detail详情，cart购物车
					order_type: 1,
					data: [],
					is_cxhd:1,
					buy_cxhd_num:this.buynum,
					activity_id:this.listid
				}
				let obj = {
					"1": "biggoodsunit",
					"2": "middlegoodsunit",
					"3": "smallgoodsunit"
				}
				this.dataAll.activitygoods.forEach(item => {
					data.data.push({
						goods_id: item.goods_id,
						num: item.num * this.buynum,
						goods_sku_id: item.goods[obj[item.join_goods_unit]].priceinfo.id,
						goods_type: item.goods_type == 1 ? 2 : 3,
						user_coupon_id: "",
						price: item.price,
						
					})
				})
				uni.navigateTo({
					url: "/pages/shoppingCart/orderDetail?data=" + encodeURIComponent(JSON.stringify(data))
				})
			},
			// 购物车+
			plus(val) {
				if (val == 2 && !this.buynum) {
					this.buynum = 1
					return
				}
				if (val != 2) {
					this.buynum = Number(this.buynum) + 1
				}
			},
			// 购物车——
			minus() {
				if (this.buynum == 1) {
					httpRequest.toast("不能再减了哦！")
					return false
				}
				this.buynum = Number(this.buynum) - 1
			},
			getdetail() {
				httpRequest.request('/customapi/user/activityDetail', 'POST', {
					id: this.listid
				}).then(res => {
					let price = 0
					res.data.activitygoods.forEach(item => {
						price = Number(price) + Number(item.price)*item.num
					})
					this.price_dj = price
					this.price_zj = Number(price).toFixed(2)
					this.dataAll = res.data
					this.pageShow = true
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.bghui {
		background-color: #f7f7f6;
	}
	
		.reduceimg {
			width: 50rpx;
			height: 50rpx;
			background-image: url("@/static/userOrder/reduceimg.png");
			background-size: 100% 100%;
		}
	
		.addimg {
			width: 50rpx;
			height: 50rpx;
			background-image: url("@/static/userOrder/addimg.png");
			background-size: 100% 100%;
		}
	.btn {
		padding: 20rpx 40rpx;
		border-radius: 50rpx;
		color: #fff;
		background-color: #ffaf44;
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
	}

	.flexcolumn {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		height: 130rpx;
		width: 100%;
	}

	.leftimage {
		width: 130rpx;
		height: 130rpx;
		min-width: 130rpx;
		max-width: 130rpx;
		border-radius: 10rpx;
	}

	.xiaoyuan {
		width: 20rpx;
		height: 20rpx;
		background-color: #ffaf44;
		border-radius: 50rpx;
		margin-right: 10rpx;
	}

	.titletext {
		font-size: 32rpx;
	}

	.mgrgin_left1 {
		margin-left: 10rpx;
	}
</style>